<!-- 清罐 -->
<template>
  <div class="wrap">
    <div class="main">
      <div class="row">
        <div class="left">旧</div>
        <div class="right">
          <input v-model="oldPassword" type="password" placeholder="请输入旧密码" />
        </div>
      </div>
      <div class="row">
        <div class="left">新</div>
        <div class="right">
          <input v-model="newPassword1" type="password" placeholder="请输入新密码" />
        </div>
      </div>
      <div class="row">
        <div class="left">新</div>
        <div class="right">
          <input v-model="newPassword2" type="password" placeholder="请再次输入新密码" />
        </div>
      </div>
      <div class="button_wrap">
          <button @click="sure()" style="background:#3b8ce7;color:white;width:8rem;">确认</button>
      </div>
      
    </div>
  </div>

</template>
<script>
  import { MessageBox } from 'mint-ui';
  export default {
    data() {
      return {
        useInfo:{},
        oldPassword: '',
        newPassword1:'',
        newPassword2:'',
      }
    },
    methods: {
      sure(){
        if(this.newPassword1 != this.newPassword2){
          MessageBox('提示', '密码不一致');
          return false;
        }
        var params = {
          username:this.useInfo.username,
          company_id:this.useInfo.company_id,
          old_password:this.oldPassword,
          new_password:this.newPassword1,
        }
        this.$api.post('/wechat/modifyPassword', params, (data) => {
          MessageBox('提示', '修改成功');
        })
      }
    },
    created() {
      this.useInfo = JSON.parse(sessionStorage.getItem("loginData"));
    },
  }

</script>
<style scoped>
  .main {
    padding-top: 0.7rem;
  }

  .row {
    display: flex;
    height: 1rem;
  }

  .row .left {
    margin-left:1.5rem;
    width: 0.5rem;
    border-radius: 0.25rem;
    text-align: center;
    border:2px sandybrown solid; 
    line-height: 0.54rem;
    color:sandybrown; 
    height: 0.6rem;
    margin-top:0.13rem;
  }

  .row .right {
    width: 6rem;
    margin-left: 0.2rem;
    text-align: left;
  }

  .row .right input {
    height: 0.9rem;
    line-height: 0.9rem;
    padding-left: 0.1rem;
    border: none;
    outline: none;
    width: 100%;
    border-bottom: 1px solid #ccc;
  }
  .button_wrap {
    display: flex;
    justify-content: center;
    margin-top: 3rem;
  }

  .button_wrap button {
    padding: 0.45rem 0.55rem 0.4rem;
    border: none;
    font-size: 0.6rem;
    border-radius: 0.2rem;
    margin-right: 0.3rem;
  }
</style>
